﻿/// <reference path="typings/jquery/jquery.d.ts" />
/// <reference path="typings/jquery/bootstrap.d.ts" />

// Auto fixed category menu
$(window).load(function () {
    $('menu').affix({
        offset: {
            top: $('header').height()
        }
    });
});

//Check to see if the window is top if not then display button
$(window).scroll(function () {
    if ($(this).scrollTop() > 100) {
        $('#btnScrollTop').fadeIn();
    } else {
        $('#btnScrollTop').fadeOut();
    }
});

//Click event to scroll to top
$('#btnScrollTop').click(function () {
    $('html, body').animate({ scrollTop: 0 }, 800);
    return false;
});

var Eventt = (function () {
    function Eventt() {
        this.controller = "Event";
    }

    Eventt.prototype.Upcoming = function (element, date, categoryId) {
        $.ajax({
            url: "/" + this.controller + "/_AjaxUpcomingEvent",
            data: {
                date: date,
                categoryId: categoryId
            },
            method: "post",
            dataType: "html",
            success: function (response) {
                $('#frmUpcomingEvent').html(response);
                $('.list-date li').removeClass('active');
                $(element).parent().addClass('active');
            }
        });
    };

    return Eventt;
})();

var Product = (function () {
    function Product() {
        this.controller = "Product";
    }

    Product.prototype.DetailsLoading = function () {
        var mainImage = $('#mainImage');
        var mainVideo = $('#mainVideo');

        // Get link first image
        var image = $('.thumbImage .imgThumb:first-child');
        var zoom = image.attr('data-original');
        var src = zoom + '?w=500';
        var standard = image.attr('data-standard');
        var css = '';
        if (standard == '0') {
            src = src + '&h=500';
            css = 'no-standard';
        }
        mainImage.attr('src', src);
        mainImage.addClass(css);

        // Check video is already
        if ($('#HaveVideo').val() == 0) {
            image.addClass('active');
            mainImage.show();
        }
        else {
            // Get link video
            var video = $('.thumbImage .vidThumb');
            video.addClass('active');
            src = video.attr('data-original');
            mainVideo.attr('src', src);

            // Run video
            var videoPlayer = <HTMLVideoElement> document.getElementById('mainVideo');

            mainVideo.show();
            videoPlayer.play();

            // After video finish
            videoPlayer.addEventListener('ended', function () {
                mainVideo.hide();
                $('.thumbImage img').removeClass('active');
                image.addClass('active');
                mainImage.show();          
            });
        }

        // Zoom image
        $(window).load(function () {
            $('.zoomImg').attr('src', zoom);         
        });
    };

    Product.prototype.ThumbImageClick = function (element) {
        var e = $(element);
        $('.thumbImage img').removeClass('active');
        e.addClass('active');

        // Get link image,...
        var src = e.attr('data-original');
        $('.zoomImg').attr('src', src);
        src = src + '?w=500';
        var standard = e.attr('data-standard');
        var css = '';
        if (standard == '0') {
            src = src + '&h=500';
            css = 'no-standard';
        }
        var mainImage = $('#mainImage');
        mainImage.addClass(css);
        mainImage.attr('src', src);

        $('#mainVideo').hide();
        mainImage.show();
    };

    Product.prototype.ThumbVideoClick = function (element) {
        var e = $(element);
        $('.thumbImage img').removeClass('active');
        e.addClass('active');

        // Get link first image
        var mainImage = $('#mainImage');
        var image = $('.thumbImage .imgThumb:first-child');
        var src = image.attr('data-original') + '?w=500';
        var standard = image.attr('data-standard');
        var css = '';
        if (standard == '0') {
            src = src + '&h=500';
            css = 'no-standard';
        }
        mainImage.attr('src', src);
        mainImage.addClass(css);

        // Get link video,...
        var src = e.attr('data-original');
        var mainVideo = $('#mainVideo');
        mainVideo.attr('src', src);
        $('#mainImage').hide();
        mainVideo.show();

        // Run video
        var videoPlayer = <HTMLVideoElement> document.getElementById('mainVideo');
        videoPlayer.play();
    }

    return Product;
})();

class ShoppingCart {
    controller = "ShoppingCart";

    Show() {
        $.ajax({
            url: "/" + this.controller + "/Show",
            data: {},
            method: "post",
            dataType: "html",
            success: function (response) {
                $('#shoppingCartModal').html(response);
            }
        });
    }

    Add(self, styleId) {
        $.ajax({
            url: "/" + this.controller + "/Add",
            data: {
                id: styleId
            },
            method: "post",
            dataType: "json",
            success: function (response) {
                $('.quantityInCart').html(response);
                $('.btnShoppingCart').first().click();
            }
        });
    }

    Edit(element) {
        $.ajax({
            url: "/" + this.controller + "/Edit",
            data: {
                id: $(element).attr('data-id'),
                quantity: $(element).val()
            },
            method: "post",
            dataType: "json",
            success: function (response) {
                $('.quantityInCart').html(response);
                new ShoppingCart().Show();
            }
        });
    }

    Delete(element) {
        $.ajax({
            url: "/" + this.controller + "/Delete",
            data: {
                id: $(element).attr('data-id')
            },
            method: "post",
            dataType: "json",
            success: function (response) {
                $('.quantityInCart').html(response);
                new ShoppingCart().Show();
            }
        });
    }
}

class Payment {
    controller = "Payment";

    Index(receiverId) {
        // Sender
        $.ajax({
            url: "/" + this.controller + "/_Sender",
            data: {},
            method: "get",
            dataType: "html",
            success: function (response) {
                $('#pv-sender').hide().html(response).fadeIn();
            }
        });

        // Receiver
        $.ajax({
            url: "/" + this.controller + "/_Receiver",
            data: {
                id: receiverId,
            },
            method: "get",
            dataType: "html",
            success: function (response) {
                $('#pv-receiver').hide().html(response).fadeIn();
            }
        });

        // ShoppingCart
        $.ajax({
            url: "/" + this.controller + "/_ShoppingCarts",
            data: {},
            method: "get",
            dataType: "html",
            success: function (response) {
                $('#pv-details').hide().html(response).fadeIn();
            }
        });

        // OnePay
        $.ajax({
            url: "/" + this.controller + "/_OnePay",
            data: {},
            method: "get",
            dataType: "html",
            success: function (response) {
                $('#pv-onepay').hide().html(response).fadeIn();
            }
        });
    }

    Confirmation(receiverId, orderId) {

        if (receiverId != null && orderId != null) {
            // Sender
            $.ajax({
                url: "/" + this.controller + "/_Sender",
                data: {},
                method: "get",
                dataType: "html",
                success: function (response) {
                    $('#pv-sender').hide().html(response).fadeIn();
                }
            });

            // Receiver
            $.ajax({
                url: "/" + this.controller + "/_Receiver",
                data: {
                    id: receiverId,
                },
                method: "get",
                dataType: "html",
                success: function (response) {
                    $('#pv-receiver').hide().html(response).fadeIn();
                }
            });

            // OrderStyles
            $.ajax({
                url: "/" + this.controller + "/_OrderStyles",
                data: {
                    orderId: orderId
                },
                method: "get",
                dataType: "html",
                success: function (response) {
                    $('#pv-details').hide().html(response).fadeIn();
                }
            });
        } 
    }
}




